/* ======================================================
    <!-- Form  ( Material Design Theme )-->
/* ====================================================== */
@import '@/components/_utils/styles/_variable-and-mixin.scss';
@import '_variable-and-mixin.scss';

/*
 * 1. Controls
 * 4. Custom Select
*/

/*
 ---------------------------
 1. Controls
 ---------------------------
 */
@mixin create-line-rtl() {
    .rtl .poemkit-controls__basic-bar,
	.rtl .poemkit-controls__bar {
		left: auto;
        right: 0;
	}
}


/* Default Controls */
.rtl .poemkit-controls:not(.poemkit-controls__toggle):not(.poemkit-controls__checkbox):not(.poemkit-controls__radio):not(.poemkit-controls__select) {

    //Create Line Effect on Click
    @include create-line-rtl();

}

/* Create Line Effect on Click */
.rtl .poemkit-controls.poemkit-controls--line {


	label {
		left: auto !important;
		right: - 0.25rem !important;

		&.is-active {
			transform-origin: right top;
			transform: translateX(1.75rem) scale(.875);

		}


	}

	/*-- Form With Icon --*/
	&.is-iconic {
        

		label {
            left: auto !important;
			right: #{$control-padding-side + $control-icon-placeholder} !important;

			&.is-active {
				transform: translateX(4.09375rem) scale(.875);
			}
		}


        
        
		&.is-reversed {
            
            
 			input:not([type="checkbox"]):not([type="radio"]) {
				padding-right: 0 !important;

			}

			textarea,
			button:not(.poemkit-btn),
			select {
				padding-right: 0 !important;
			}
 
            

			label {
                left: auto !important;
				right: -0.25rem !important;

				&.is-active {
					transform: translateX(1.75rem) scale(.875);
				}
			}
		}


	}


	/*-- Select --*/
	&.poemkit-controls__normal-select {

	
		select {
			padding-right: 0 !important;
            padding-left: #{$control-padding-side + 1} !important; 
		}


	}

    

}


/*
 ---------------------------
 4. Custom Select
 ---------------------------
 */

.rtl .poemkit-controls__select-wrapper {

	&.poemkit-controls--line.is-disabled {

		/* Mask used to prohibit selection */
		&::before {
			left: auto;
            right: 0;

		}

	}


	.poemkit-controls--line  {
		.poemkit-controls__select-trigger {
			padding-right: 0;

		}

       
	}


}



